<%@page language="java" pageEncoding="UTF-8"%>
<%@include file="/views/common/include/taglib.jsp"%>
<link type="text/css" rel="stylesheet" href="${ctx }/css/dlifestyle/sectionparent.css" source="widget" />
<link type="text/css" rel="stylesheet" href="${ctx }/css/dlifestyle/admin.css" source="widget" />
<link type="text/css" rel="stylesheet" href="${ctx }/css/dlifestyle/new-add-goods.css" source="widget" />
<style type="text/css">
select {
	padding-left: 4px;
	font-size: 10px;
	border-radius: 10px;
	background-image: none;
	border: 1px solid #dadada;
	color: #8b8b8b;
}

.checkTitle ul li {
	color: #565252;
	font-size: 14px;
	float: left;
}

.checkTitle ul li  a:active {
	border-right: 1px solid #CBD5DD;
	padding: 2px 15px 12px 15px;
	border-top: 1px solid #cbd5dd;
}

.checkTitle li.active {
	border-color: #CBD5DD !important;
	border-bottom-color: #fff !important;
}

.btn_addPic {
	display: inline-block;
	position: relative;
	height: 41px;
	overflow: hidden;
	padding: 0 20px;
	border: 1px solid #EBEBEB;
	background: none repeat scroll 0 0 #F9C771;
	color: #fff;
	font: 14px/39px 'MicroSoft Yahei', 'Simhei';
	cursor: pointer;
	text-align: center;
	margin-top: 20px;
	margin-left: 20px;
	width: 140px;
}

.inputClass {
	height: 30px;
	width: 200px;
	margin-left: 20px;
	margin-top: 25px;
	border: 1px solid #CBD5DD;
	text-indent: 10px;
	float: left;
}

.addorcancleAttr {
	width: 45px;
	height: 25px;
	margin-left: 10px;
	padding-top: 5px;
	padding-left: 10px;
	background-color: #F9C771;
	color: white;
	cursor: pointer;
	float: left;
	margin-top: 26px;
}

.emStyle {
	color: #7da4cc;
	line-height: 43px;
	margin-left: -12px;
	margin-top: 7px;
}

.current-pic {
	position: absolute;
	bottom: 0px;
	left: 0;
}

.wrap-box {
	position: relative;
	overflow: hidden;
	height: 31px;
}

.span-l{
    margin-left: 100px;
}

.col-sm-1 {
    padding-right:20px;
    height:50px;
    line-height:50px;
}
.fldetail-4l {
    width:280px;
    padding-top:0px;
    height:51px;
    line-height:51px;
}
.fldetail-4r {
    padding-top:0px;
    height:51px;
    line-height:51px;
}
</style>
<div style="top: 130px; position: fixed; height: 30px; font-size: 14px; font-family: '微软雅黑'; margin-left: -236px;">当前位置：${sessionScope.currcent_position}</div>
<section style="margin-top: 16px; height:auto;">
    <div style="height: 30px; line-height: 30px; margin-bottom: 17px; overflow: hidden">
        <div style="float: left; height: 31px; width: 120px; color: #808080; font-size: 14px; wcursor: pointer;" onclick="gotoGoodsInfo(this)">
            <div class="wrap-box">
                <input type="hidden" value="0" /> 
                <img id="selected1" src="${ctx}/images/seller/coupon/select_yellow.png" style="margin-top: -4px;"> <a>商品信息详情</a> 
            </div>
        </div>
    </div>
    <!--end 搜索栏 -->
    <div id="goodsInfo" class="form" style=" border: 1px solid #dadada;height:auto;">
        <div class="itemEditMap" style="height: 160px; margin-left: -100px;">
            <input id="goodsId" type="hidden" value="${goodsInfo.id}"> 
            <input id="imageLogo" type="hidden" value="${goodsInfo.logo}"> 
            <span class="col-sm-1 editlableDetail span-l" style="height: 160px; line-height: 160px;">商品封面图：</span>
            <div class="flEditMap" style="margin-top: 30px;width:200px;">
                <c:if test="${goodsInfo.logo == null || goodsInfo.logo == ''}">
                    <img id="preview3" style="width: 100px; height: 100px; border-radius: 14px; float: left;" title="快上传小区头像吧" src="${ctx}/images/seller/common/defaultgoods.jpg" />
                </c:if>
                <c:if test="${goodsInfo.logo != null && goodsInfo.logo != ''}">
                    <img id="preview3" style="width: 100px; height: 100px; border-radius: 14px; float: left;" src="${sessionScope.image_logo}${goodsInfo.logo}" />
                </c:if>
            </div>
        </div>
        <div class="itemEdit" style="margin-left: -100px; border-bottom: 1px solid #CBD5DD;">
            <span class="col-sm-1 editlableDetail span-l" style="font-size: 14px;">&nbsp;商品名称：</span>
            <div class="fldetail-4l">${goodsInfo.name }</div>
            <span class="col-sm-1 editlableDetail" style="font-size: 14px;">&nbsp;推荐等级：</span>
            <div class="fldetail-4r">${goodsInfo.isRecommend }</div>
            <%-- <span class="col-sm-1 editlableDetail" style="font-size: 14px;">&nbsp;商品描述：</span>
                <%-- <c:choose>
                    <c:when test="${fn:length(goodsInfo.detail) > 8}">
                        <div class="fldetail-4r" id="addr${goodsInfo.id}" onmouseover="mouseOverAddr(${goodsInfo.id} , '${goodsInfo.detail}')" onmouseout="mouseOutAddr(${goodsInfo.id} , '${goodsInfo.detail}')">${fn:substring(goodsInfo.detail , 0 , 15)}...</div>
                    </c:when>
                    <c:otherwise>
                        <div class="fldetail-4r" id="addr${goodsInfo.id}">${goodsInfo.detail}</div>
                    </c:otherwise>
                </c:choose> --%>
        </div>
        <div class="itemEdit" style="margin-left: -100px; border-bottom: 1px solid #CBD5DD;">
            <span class="col-sm-1 editlableDetail span-l" style="font-size: 14px;">&nbsp;商品一级分类：</span>
                <div class="fldetail-4l">
                <select id="firstCategory" onblur="checkGoodsCategaryOne()" style="height: 37px; line-height: 37px; width: 240px; font-size: 12px;" disabled="disabled">
                    <option value="">--一级分类--</option>
                    <c:forEach items="${firstCategory}" var="firstItem" varStatus="status">
                        <c:if test="${firstItem.id == goodsCategory.parentId}">
                            <option id="${firstItem.name}" value="${firstItem.id}" selected>${firstItem.name}</option>
                        </c:if>
                        <c:if test="${firstItem.id != goodsCategory.parentId}">
                            <option id="${firstItem.name}" value="${firstItem.id}">${firstItem.name}</option>
                        </c:if>
                    </c:forEach>
                </select> 
                </div>
                <span class="col-sm-1 editlableDetail" style="font-size: 14px;">&nbsp;商品二级分类：</span>
                <div class="fldetail-4r">
                <select id="secondCategory" onblur="checkGoodsCategaryTwo()" style="height: 37px; line-height: 37px; width: 240px; font-size: 12px;" disabled="disabled">
                    <option value="">--二级分类--</option>
                    <c:if test="${not empty secondCategory}">
                        <c:forEach items="${secondCategory}" var="secondItem" varStatus="status">
                            <c:if test="${secondItem.id == goodsInfo.goodsCategoryId}">
                                <option id="${secondItem.name}" value="${secondItem.id}" selected>${secondItem.name}</option>
                            </c:if>
                            <c:if test="${secondItem.id != goodsInfo.goodsCategoryId}">
                                <option id="${secondItem.name}" value="${secondItem.id}">${secondItem.name}</option>
                            </c:if>
                        </c:forEach>
                    </c:if>
                </select>
                </div>
        </div>
        <div class="itemEdit" style="margin-left: -100px; border-bottom: 1px solid #CBD5DD;">
            <span class="col-sm-1 editlableDetail span-l" style="font-size: 14px;">&nbsp;商品价格：</span>
            <div class="fldetail-4l">${goodsInfo.price }</div>
            <span class="col-sm-1 editlableDetail" style="font-size: 14px;">&nbsp;市场价：</span>
            <div class="fldetail-4r">${goodsInfo.marketPrice }</div>
        </div>
        <div class="itemEdit" style="margin-left: -100px; border-bottom: 1px solid #CBD5DD;">
            <span class="col-sm-1 editlableDetail span-l" style="font-size: 14px;">&nbsp;库存：</span>
            <div class="fldetail-4l">${goodsInfo.stock }</div>
            <span class="col-sm-1 editlableDetail" style="font-size: 14px;">&nbsp;单位：</span>
            <div class="fldetail-4r">${goodsInfo.unit }</div>
        </div>
        <div class="itemEdit" style="margin-left: -100px; border-bottom: 1px solid #CBD5DD;">
            <span class="col-sm-1 editlableDetail span-l" style="font-size: 14px;">&nbsp;关键字：</span>
            <div class="fldetail-4r">${keyword}</div>
        </div>
        
       <div class="itemEdit" style="margin-left: -100px; border-bottom: 1px solid #CBD5DD; min-height:220px;">
            <span class="col-sm-1 editlableDetail span-l" style="font-size: 14px; min-height:220px;">&nbsp;商品图片：</span>
            <div style="float: left; margin-top:5px; margin-left: 20px; width: 50%;">
                <input id="imgLength" type="hidden" value="${fn:length(imgs)}">
                <div id="imgArea" style="float: left;">
                    <c:if test="${fn:length(imgs) > 0}">
                        <c:forEach items="${imgs}" var="item" varStatus="status">
                            <div id="delete${item.url}" style="float: left;">
                                <input id="imgId${status.index+1}" type="hidden" value="${item.url}"> <img id="imgPic${item.url}" width="100px" height="100px;"
                                    style="border-radius: 14px; float: left; margin-right: 10px;" src="${sessionScope.image_logo}${item.url}">
                            </div>
                        </c:forEach>
                    </c:if>
                </div>
            </div>
        </div>
        
         <%-- <div class="itemEdit" style="margin-left: -100px; border-bottom: 1px solid #CBD5DD;height:400px;height:auto;min-height:500px;">
            <span class="col-sm-1 editlableDetail span-l" style="font-size: 14px; height:400px;height:auto;min-height:500px;">&nbsp;商品描述：</span>
                <c:choose>
                    <c:when test="${fn:length(goodsInfo.detail) > 8}">
                        <div class="fldetail-4r" id="addr${goodsInfo.id}" onmouseover="mouseOverAddr(${goodsInfo.id} , '${goodsInfo.detail}')" onmouseout="mouseOutAddr(${goodsInfo.id} , '${goodsInfo.detail}')">${fn:substring(goodsInfo.detail , 0 , 15)}...</div>
                    </c:when>
                    <c:otherwise>
                        <div class="fldetail-4r" id="addr${goodsInfo.id}">${goodsInfo.detail}</div>
                    </c:otherwise>
                </c:choose> 
                <div class="fldetail-4r" id="addr${goodsInfo.id}">${goodsInfo.detail}</div>
         </div> --%>

        <table id="contentDiv" style="border-bottom: 1px solid #CBD5DD; border-top: none; width: 100%; height: 200px;" cellspacing="0" cellpadding="0">
            <tr>
                <td id="contentSpan" style="color: #504949; font-size: 14px; width: 18.6%; background-color: #EAFBFC; text-align: right; height: 37px; line-height: 37px; vertical-align: text-top;">
                    <span class="col-sm-1 editlableDetail span-l" style="font-size: 14px; width: 80px; margin-left: 78px;">商品描述：</span>
                </td>
                <td style="text-align: left; width: 100%; min-height: 200px; padding: 8px 20px; vertical-align: text-top;">${goodsInfo.detail}</td>
            </tr>
        </table>

        <div id="goodsSpec">
        <div class="add-newattr">
            <table id="attr_spec">
                <tr style="height: 40px;">
                    <c:forEach items="${attrNames}" var="attrName" varStatus="attrNameStatus">
                        <td class="bg-td" width="150px" style="color: black; font-size: 15px;">${attrName}</td>
                    </c:forEach>
                    <td class="bg-td" width="150px" style="color: black; font-size: 15px;">价格</td>
                    <td class="bg-td" width="150px" style="color: black; font-size: 15px;">库存</td>
                </tr>
                <c:forEach items="${goodsSpecList}" var="specInfo" varStatus="specInfoStatus">
                    <tr>
                        <c:forEach items="${specInfo.goodsSpecificationAttrs}" var="attrInfo" varStatus="attrInfoStatus">
                            <td><input type="text" class="add-input" value="${attrInfo.attrValue}"></td>
                        </c:forEach>
                        <td><input type="text" name="price" onkeyup="checInputNum(this)" class="add-input" value="${specInfo.price}" /></td>
                        <td><input type="text" name="stock" onkeyup="checInputNumOnly(this)" class="add-input" value="${specInfo.stock}" /> <input type="hidden" name="specId"
                            value="${specInfo.id}" /></td>
                    </tr>
                </c:forEach>
            </table>
        </div>
        <div>
            <div id="goodsSpecification" style="margin: 0px 20px;"></div>
        </div>
    </div>
        
        
         
   
    </div>
</section>
<script src="${ctx}/js/controllers/goods/GoodsInfoListController.js" type="text/javascript"></script>
<script type="text/javascript">
    var ctx = '${ctx}';
    setCtx(ctx);
</script>
<!-- 解决ie 6 7 8 9不能显示placeholder的问题 -->
<script src="${ctx}/js/lib/jquery.JPlaceholder.js"></script>
